<template>
  <div
    ref="operateRef"
    class="top-operate"
  >
    <div
      v-for="item in list"
      :key="item.icon"
      class="operate-item _no_drag_area"
      @click="item.click"
    >
      <svg-icon
        :icon-class="item.icon"
        :size="24"
      />
    </div>
  </div>
  <setting-popup-menu v-model="settingVisible" />
</template>

<script setup lang="ts">
import { ref } from 'vue'
import {useDownloadManageWindow} from '@/stores/download-manage-window'
import { storeToRefs } from 'pinia';
import { invokeAsyncAPi } from '@/utils/xz-fn'
import { useDownloadPath } from '@/stores/download-path'
import { useDownloadManage } from '@/stores/download-manage'
const operateRef = ref();

const settingVisible = ref(false);//设置弹出框是否出现

const downloadManageWindowStore = useDownloadManageWindow();
const { downloadManageWindowId } = storeToRefs(downloadManageWindowStore)

const downloadPathStore = useDownloadPath();
const { closeAndHide } = storeToRefs(downloadPathStore)

const downloadManageStore = useDownloadManage()

const list=[{
  icon: 'setting',
  click: () => {
    settingVisible.value = true;
  }
}, {
  icon: 'min-window',
  click:()=>windowOperate(3)
},{
  icon: 'close-window',
  click: async () => {
    if (closeAndHide.value) {//关闭只是隐藏
      windowOperate(2)
    } else {//关闭的时候退出
      invokeAsyncAPi('fq_ExitApp')
    }
    
  }
}]


const windowOperate = (type:number) => {//窗口操作
  invokeAsyncAPi('jsMsg_SetWndStatus',type)
}

</script>

<style scoped lang="scss">
.top-operate {
  position: absolute;
  user-select: none;
  top: 0px;
  right: 10px;
  height: 50px;
  display: flex;
  gap: 5px;
  -webkit-user-drag: no-drag;
  align-items: center;

  .operate-item {
    cursor: pointer;
  }

  
}
</style>
